<template>
  <div class="fixed-assessment-container">
    <!-- 市场观点模块 -->
    <MarketViewModule />

    <!-- 流动性及利差模块 -->
    <LiquiditySpreadModule />

    <!-- 债市资金模块 -->
    <BondFundModule />

    <!-- 信贷周期模块 -->
    <CreditCycleModule />

    <div class="charts-grid">
      <!-- 货币信用周期模块 -->
      <CurrencyCreditModule />

      <!-- 市场久期变化趋势模块 -->
      <DurationTrendModule />
    </div>
  </div>
</template>

<script setup lang="ts">
import MarketViewModule from './components/MarketViewModule.vue'
import LiquiditySpreadModule from './components/LiquiditySpreadModule.vue'
import BondFundModule from './components/BondFundModule.vue'
import CreditCycleModule from './components/CreditCycleModule.vue'
import CurrencyCreditModule from './components/CurrencyCreditModule.vue'
import DurationTrendModule from './components/DurationTrendModule.vue'
</script>

<style scoped>
.fixed-assessment-container {
  @apply p-6 bg-gray-50 min-h-screen;
}

.page-header {
  @apply mb-8 p-6 bg-white rounded-lg shadow-sm;
}

.page-header h1 {
  @apply mb-2;
}

.charts-grid {
  @apply grid grid-cols-1 lg:grid-cols-2 gap-6;
}
</style>
